import 'package:flutter/material.dart';
import '../demo/ui_demo.dart';
import 'data_source/post.dart';

class MyDemo extends StatelessWidget implements Demo {
  MyDemo(this.title);
  @override
  String title;
  @override
  Widget build(BuildContext context) {
    return new HomePage(title: this.title,);
  }
}

class HomePage extends StatelessWidget {
  String title;
  HomePage({this.title});

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Scaffold(
          appBar: AppBar(
            title: Text(this.title),
            centerTitle: true,
            elevation: 0,
            actions: <Widget>[
              IconSource("SliverGrid、List","07"),
            ],
            bottom: TabBar(
              tabs: <Widget>[
                Tab(
                  icon: Icon(Icons.grid_on),
                  text: "SliverGrid",
                ),
                Tab(
                  icon: Icon(Icons.list),
                  text: "SliverList",
                ),
              ],
            ),
          ),
          body: TabBarView(
            children: <Widget>[
              CustomScrollView(
                slivers: <Widget>[
                  SliverPadding(
                    padding: EdgeInsets.all(4.0),
                    sliver: SliverGridDemo(),
                  ),
                ],
              ),
              CustomScrollView(
                slivers: <Widget>[
                  SliverAppBar(
                    centerTitle: true,
                    //title: Text("SliverAppBar"),
                    floating: true,
                    snap: true, //是否固定在顶部
                    expandedHeight: 150.0,
                    flexibleSpace: FlexibleSpaceBar(
                      title: Text(
                        "Flutter SliverAppBar",
                        style: TextStyle(
                            fontSize: 15.0,
                            letterSpacing: 3.0,
                            color: Colors.white),
                      ),
                      background: Image.network(
                        "https://resources.ninghao.org/images/childhood-in-a-picture.jpg",
                        fit: BoxFit.cover,
                      ),
                    ),
                  ),
                  SliverSafeArea(
                    sliver: SliverPadding(
                      padding: EdgeInsets.all(4.0),
                      sliver: SliverListDemo(),
                    ),
                  ),
                ],
              ),
            ],
          )),
    );
  }
}

class SliverGridDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SliverGrid(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
        mainAxisSpacing: 4.0,
        crossAxisSpacing: 4.0,
      ),
      delegate: SliverChildBuilderDelegate((context, index) {
        return Container(
          color: Colors.grey,
          child: Stack(
            fit: StackFit.expand,
            children: <Widget>[
              Image.network(
                posts[index].imageUrl,
                fit: BoxFit.cover,
              ),
              Positioned(
                right: 10.0,
                top: 10.0,
                child: Text(
                  posts[index].title,
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ],
          ),
        );
      }, childCount: posts.length),
    );
  }
}

class SliverListDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return SliverList(
      delegate: SliverChildBuilderDelegate((context, index) {
        return Padding(
          padding: EdgeInsets.all(8.0),
          child: Stack(
            children: <Widget>[
              Material(
                borderRadius: BorderRadius.circular(10.0),
                elevation: 14.0,
                child: Container(
                    child: Image.network(
                  posts[index].imageUrl,
                  fit: BoxFit.cover,
                )),
              ),
              Positioned(
                top: 25.0,
                right: 25.0,
                child: Column(
                  children: <Widget>[
                    Text(
                      posts[index].title,
                      style: TextStyle(fontSize: 15.0, color: Colors.white),
                    ),
                    Text(
                      posts[index].author,
                      style: TextStyle(fontSize: 10.0, color: Colors.white),
                    ),
                  ],
                ),
              ),
              Positioned(
                left: 10.0,
                bottom: 10.0,
                right: 60.0,
                child: Text(
                  posts[index].description,
                  style: TextStyle(fontSize: 10.0, color: Colors.white),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
              )
            ],
          ),
        );
      }, childCount: posts.length),
    );
  }
}
